<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Werbung</title>



        <!--Head-->

        <style>
            .ui-dialog ui-widget ui-widget-content{ background: grey; }
        </style>


        <script type="text/javascript" src="jquery.js"></script>
        <script type="text/javascript" src="./javascripts/js/ajaxfileupload.js"></script>

        <link rel="stylesheet" href="css/default.css" />
        <link href="./css/sheet.css" rel="stylesheet" type="text/css" />


        <link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Tangerine" />
        <link rel="stylesheet" href="css/ui-lightness/jquery-ui-1.8.23.custom.css" /><!--add s to run this to put right corner-->

        <script type="text/javascript" src="./javascripts/js/jquery-1.7.2.js"></script>
        <script type="text/javascript" src="./javascripts/js/jquery.unitconversion.js"></script>
        <script type="text/javascript" src="./javascripts/js/jquery-ui-1.8.23.custom.min.js"></script>

        <script type="text/javascript" src="./javascripts/js/jquery.tools.min.js"></script><!--/for tooltip-->


        <script src="./croping/js/jquery.Jcrop.js" type="text/javascript"></script>
        <script src="./croping/js/jquery.color.js" type="text/javascript"></script>
        <link rel="stylesheet" href="./croping/css/jquery.Jcrop.css" type="text/css" />


        <script type="text/javascript" src="javascripts/jquery.pixasticEditor.js"></script>
        <script type="text/javascript" src="colorpicker/jquery.miniColors.js"></script>
        <link type="text/css" rel="stylesheet" href="colorpicker/jquery.miniColors.css" />


        <script src="./common.js" type="text/javascript"></script>
        <script src="./vc.js" type="text/javascript"></script>
        <script src="./vc2.js" type="text/javascript"></script>
        <script src="./vc3.js" type="text/javascript"></script>
        <script src="./backitem.js" type="text/javascript"></script>
        <script src="./item.js" type="text/javascript"></script>

        <script src="./undoredo.js" type="text/javascript"></script>


        <script type="text/javascript" src="javascripts/jquery.form.js"></script>







        <script type="text/javascript">
            var bannertemphtml;
            var selected=0;   
            $(document).ready(function() { 
                  
                var temp=1;
                

                bannertemphtml= $('#bannerInner').html();


                $('#bannerInner').html("");
                //$('#bannerInner').append("<div><div class='packageName'>Standard</div><div class='packageName'>Basic</div><div class='packageName'>Business</div></div><div><div class='menuopt' style='float:left;'><div><div><img border='3px' width='100%' height='auto' src='imagesapp/standard.png' /></div><div class='packageText'>In this Option you can:</br>1. Choose a Background Image.</br> 2. Choose and Edit Address to be printed on the Advent Kalender.</div></div></div><div class='menuSeparator'></div><div class='menuopt' style='float:left;'><div><div><img border='3px' width='100%' height='auto' src='imagesapp/basic.png' /></div><div class='packageText'>In this Option you can:</br>1. Choose a Background Image.</br> 2. Choose and Edit Address to be printed on the Advent Kalender.</br>3. Place text and photos with in the White Areas of the background images.</div></div></div><div class='menuSeparator'></div><div class='menuopt' style='float:left;'><div><div><img border='3px' width='100%' height='auto' src='imagesapp/business.png' /></div><div class='packageText'>In this Option you can:</br>1. Choose the shape of the Advent Kalender.</br> 2. Choose the fillings of the Advent Kalender.</br>3. Choose Address to be printed on the back.</br> 4. On the backside the user can only change color and address.</br>5. On the front the user can do any thing.</br> 6. On the side, the user can just change colors.</div></div></div></div><div><div class='menuopt' style='float:left; text-align:center; '><img id='standardButton' class='buyandchoose' src='imagesapp/choose_buy_btn_g.png' onmouseover=\"this.src='imagesapp/choose_buy_btn_o.png'\" onmouseout=\"this.src='imagesapp/choose_buy_btn_g.png'\" /></div><div class='menuopt' style='float:left;text-align:center; '><img id='basicButton' class='buyandchoose' src='imagesapp/choose_buy_btn_g.png' onmouseover=\"this.src='imagesapp/choose_buy_btn_o.png'\" onmouseout=\"this.src='imagesapp/choose_buy_btn_g.png'\" /></div><div class='menuopt' style='float:left; text-align:center;'><img id='businessButton' class='buyandchoose' src='imagesapp/choose_buy_btn_g.png' onmouseover=\"this.src='imagesapp/choose_buy_btn_o.png'\" onmouseout=\"this.src='imagesapp/choose_buy_btn_g.png'\" /></div></div>")
                $('#bannerInner').append("<div><div class='packageName'>Standard</div><div class='packageName'>Basic</div><div class='packageName'>Business</div></div><div><div class='menuopt' style='float:left;'><div><div><img border='3px' width='100%' height='195px' src='imagesapp/standard.png' /></div><div class='packageText'>In this Option you can:</br>1. Choose a Background Image.</br> 2. Choose and Edit Address to be printed on the Advent Kalender.</div></div></div><div class='menuSeparator'></div><div class='menuopt' style='float:left;'><div><div><img border='3px' width='100%' height='195px' src='imagesapp/basic.png' /></div><div class='packageText'>In this Option you can:</br>1. Choose a Background Image.</br> 2. Choose and Edit Address to be printed on the Advent Kalender.</br>3. Place text and photos with in the White Areas of the background images.</div></div></div><div class='menuSeparator'></div><div class='menuopt' style='float:left;'><div><div><img border='3px' width='100%' height='195px' src='imagesapp/business.png' /></div><div class='packageText'>In this Option you can:</br>1. Choose the shape of the Advent Kalender.</br> 2. Choose the fillings of the Advent Kalender.</br>3. Choose Address to be printed on the back.</br> 4. On the backside the user can only change color and address.</br>5. On the front the user can do any thing.</br> 6. On the side, the user can just change colors.</div></div></div></div>  <div><div class='menuopt' style='float:left; text-align:center; '><img id='standardButton' class='buyandchoose' src='imagesapp/choose_buy_btn_g.png' onmouseover=\"this.src='imagesapp/choose_buy_btn_o.png'\" onmouseout=\"this.src='imagesapp/choose_buy_btn_g.png'\" /></div><div class='menuopt' style='float:left;text-align:center; '><img id='basicButton' class='buyandchoose' src='imagesapp/choose_buy_btn_g.png' onmouseover=\"this.src='imagesapp/choose_buy_btn_o.png'\" onmouseout=\"this.src='imagesapp/choose_buy_btn_g.png'\" /></div><div class='menuopt' style='float:left;text-align:center; '><img id='businessButton' class='buyandchoose' src='imagesapp/choose_buy_btn_g.png' onmouseover=\"this.src='imagesapp/choose_buy_btn_o.png'\" onmouseout=\"this.src='imagesapp/choose_buy_btn_g.png'\" /></div></div>")
                $('.buyandchoose').click(function(){
                    //alert($(this).prop("id"));
                    //alert($(this).prop("id"));
                    $('#bannerInner').html("");
                    $("#topMenuChoosePackage img").prop("src","imagesapp/choose_package_btn_g.png");
                    $("#topMenuChooseDesign img").prop("src","imagesapp/choose_package_btn_o.png");


                    if($(this).prop("id")=="standardButton")
                    {                        
                        CH.VC2.putBackGroundInddforinitialscreen(bannertemphtml);
                        selected=0;    
                    }
                    else if($(this).prop("id")=="basicButton")
                    {
                        CH.VC3.putBackGroundInddforinitialscreen(bannertemphtml);
                        selected=0;
                    }
                    else if($(this).prop("id")=="businessButton")
                    {                                               
                        CH.VC.putchooseformatforinit();
                        selected=1;
                        
                    }
                });








                $('.maindiv').hide();
                
            });
                            
        </script>

        <!--End Of Head-->
    </head>

    <body>

        <div class="container">
            <div class="headWrapper">
                <div id="main-menu-new" style='padding-top:3px;'>
                    <a id='topMenuChoosePackage' href=''><img src='imagesapp/choose_package_btn_g.png' onmouseover="this.src='imagesapp/choose_package_btn_o.png'" onmouseout="this.src='imagesapp/choose_package_btn_g.png'" /></a>
                    <img style='cursor:pointer' id='topMenuChooseDesign' src='imagesapp/choose_design_btn_g.png' onmouseover="this.src='imagesapp/choose_design_btn_o.png'" onmouseout="this.src='imagesapp/choose_design_btn_g.png'" />
                    <img style='cursor:pointer' id='topMenuChooseAddress' src='imagesapp/add_address_btn_g.png' onmouseover="this.src='imagesapp/add_address_btn_o.png'" onmouseout="this.src='imagesapp/add_address_btn_g.png'" />
                </div>
            </div>
            <div id="bannerInner">
                <table width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                        <td style="width:320px;" align="center" valign="top" >
                            <div class='dd_BG_top' id='leftbartop'></div>							
                            <div id="dd_BG" class="dd_BG"></div>							
                            <div class='dd_BG_bottom'></div>							


                        </td>
                        <td>




                            <table border="0" cellspacing="0" cellpadding="0">
                                <tr>
                                    <td>
                                        <!--BODY-->
                                        <div id="outer" style="display: none;">

                                        </div>
                                        <div class="maindiv" style="margin-left:5px">
                                            <div class="tools" style="width:600px; background-color:#ccc; border-top :1px solid #ccc; border-left :1px solid #ccc; border-right :1px solid gray; border-bottom :1px solid gray;">

                                                <div id='toolbarCommonAction' class='toolbarInner' style="border-right:1px solid gray">
                                                    <div>
                                                        <button name="Load" class='toolbarBtn' id="Load"><img src="imagesapp/load.png" width="12" height="12" alt="Load" /></button>
                                                        <button name="Save" class='toolbarBtn' id="Save"><img src="imagesapp/save.png" width="12" height="12" alt="Save" /></button>
                                                        <button class='toolbarBtn' id="removeButton"><img src="imagesapp/delete.png" width="12" height="12" alt="Delete" /></button>
                                                        <button class='toolbarBtn' name="ZoomIn" value="ZoomIn" type="button" onclick="drop.style.zoom='150%'"><img src="imagesapp/zoomin.png" width="12" height="12" alt="ZoomIn" /></button>
                                                        <button class='toolbarBtn' name="ZoomOut" value="ZoomOut" type="button" onclick="drop.style.zoom='100%'"><img src="imagesapp/zoomout.png" width="12" height="12" alt="ZoomOut" /></button>
                                                    </div>
                                                    <div>
                                                        <button name="Undo" class='undoRedo'  id="UndoButton">Undo  <img src="imagesapp/Undo.png" width="12" height="12" alt="Undo" /></button>
                                                        <button name="Redo" class='undoRedo' id="RedoButton">Redo  <img src="imagesapp/Redo.png" width="12" height="12" alt="Redo" /></button>
                                                    </div>
                                                    <div>
                                                        <button name="Copy" class='undoRedo'   id="CopyButton">Copy  <img src="imagesapp/Copy.png" width="12" height="12" alt="Copy" /></button>
                                                        <button name="Paste" class='undoRedo'   id="PasteButton">Paste  <img src="imagesapp/Paste.png" width="12" height="12" alt="Paste" /></button>
                                                    </div>
                                                </div>
                                                <div id='toolbarImageAction' class='toolbarInner' style="border-right:1px solid gray">
                                                    <div>
                                                        <button name="addtext" style="width:100px;font-size:10px;"  id="addButton">Text  <img src="imagesapp/addtext.png" width="12" height="12" alt="Add-Text" /></button>
                                                    </div>
                                                    <div>
                                                        <button name="upphot" style="width:100px;font-size:10px;" id="upphot">Image <img src="imagesapp/upphot.png" width="12" height="12" alt="UploadPhoto" /></button>
                                                    </div>
                                                    <div>
                                                        <button style="width:100px;font-size:10px;" name="changebackground"  id="changebg">Background <img src="imagesapp/changebg.png" width="12" height="12" alt="Change backgroud" /></button>														
                                                    </div>
                                                </div>
                                                <div id='toolbarFontAction' class='toolbarInner' style="border-right:1px solid gray">
                                                    <div>
                                                        <select id="font1" onchange="CH.VC.asadFunc();" style="font-size:10px">
                                                            <option style="font-family: Arial;">Arial</option>
                                                            <option style="font-family: Tangerine;">Tangerine</option>
                                                            <option style="font-family: Georgia;">Georgia</option>
                                                            <option style="font-family: Verdana;">Verdana</option>
                                                            <option style="font-family: Times New Roman;">Times New Roman</option>
                                                            <option style="font-family: Lucida Grande;">Lucida Grande</option>
                                                            <option style="font-family: Lucida Sans Unicode;">Lucida Sans Unicode</option>
                                                            <option style="font-family: Courier New;">Courier New</option>
                                                        </select>													
                                                        <select id="fontsize" style="font-size:10px">
                                                            <option>10</option>
                                                            <option>12</option>
                                                            <option>14</option>
                                                            <option>16</option>
                                                            <option>18</option>
                                                            <option>20</option>
                                                            <option>22</option>
                                                            <option>24</option>
                                                            <option>28</option>
                                                            <option>32</option>
                                                            <option>38</option>
                                                        </select>
                                                        <!--<img src="imagesapp/colorpicker.png" width="18" height="18" style="cursor:pointer" alt="Choose-Color" />-->
                                                        <input type="hidden" id="colpick" name="color1" class="color-picker" size="6" autocomplete="on" maxlength="10" />
                                                    </div>
                                                    <div>
                                                        <button name="Bold" id="boldbutton" class='toolbarBtn'><b>B</b></button>
                                                        <button name="Italic" id="italicbutton" class='toolbarBtn'><i>I</i></button>
                                                        <button name="Underline" id="underlinebutton" class='toolbarBtn'><u>U</u></button>														
                                                    </div>
                                                    <div>
                                                        <button name="LeftAlign" class='toolbarBtn' id="Lalignbutton"><img src="imagesapp/Lalign.png" width="12" height="12" alt="Left-align" /></button>
                                                        <button name="CenterAlign" class='toolbarBtn' id="Calignbutton"><img src="imagesapp/Calign.png" width="12" height="12" alt="Cent-align" /></button>
                                                        <button name="RightAlign" class='toolbarBtn' id="Ralignbutton"><img src="imagesapp/Ralign.png" width="12" height="12" alt="Right-align" /></button>			
                                                    </div>
                                                </div>
                                                <div id='toolbarViewAction' class='toolbarInner'>
                                                    <div id='sidebuttons'>



                                                    </div>
                                                    <div id="clrpikr"><input type="hidden" id="colpickfordiv" name="color1" class="color-picker-for-background" size="6" autocomplete="on" maxlength="10" />
                                                    </div>


                                                    <div id="epspreview"><button class='epsbutton' id="epsbutton">preview</button></div>


                                                </div>
                                                <div style="clear:both"></div>
                                            </div>
                                            <div class="sider" style="margin-top:3px;height:580px; width: 350px;">
                                                <div class="drop" id="drop" >
                                                </div>                                                
                                            </div>
                                            <div>
                                                <div style="height: 100px;width:600px; clear:both; padding-top:2px; text-align:right; padding-right:5px; font-size:12px" id="viewLblDiv">You are currently working on : <span id="viewLbl">Front View</span></div>
                                            </div>
                                        </div>




                                        <div id="tempo"></div>


                                        <div style="display:none;">
                                            <div id="dialogBox1"><textarea rows="2" cols="15" id="myTextarea"> </textarea></div>
                                        </div> 





                                        <div id="cropper" style="display:none;"><h1>Crop Image</h1>


                                            <div id="target"></div>


                                            <div id="previeweps"  style="display:none;"> <div class="prev-content"></div></div>
                                            <div id="display"  style="display:none;"><h1>Predefined Background imagesapp</h1></div>



                                            <div id="packagesrc"  style="display:none;"><h1>Choose your package first</h1></div>






                                        </div>


                                        </div><!--END OF Outer-->
                                        <!--END OF BODY-->



                                    </td>
                                </tr>
                                <tr>
                                    <td>&nbsp;</td>
                                    <td>&nbsp;</td>
                                </tr>
                            </table>


                        </td>
                    </tr>
                    <tr>
                        <td>&nbsp;</td>
                        <td>&nbsp;</td>
                    </tr>
                </table>


            </div>




    </body>
</html>
